$(function () {
  $('.error-tips').hide();

  // $('input').on('focus', function () {
  //   $(this).css('border-color', '')
  //   $(this).parent().children().last().hide();
  // });
  // $('input').on('blur', function () {
  //   var previousValue = $(this).val().trim();
  //   if (previousValue === '' || previousValue === null) {
  //     $(this).css('border-color', '#fc924c');
  //     $(this).parent().children().last().show();
  //     $('#customUploadBtn').disabled = true;

  //   } else {
  //     $(this).css('border-color', '');
  //     $(this).parent().children().last().hide();
  //     $('#customUploadBtn').disabled = false;
  //   }
  // });

  // 获取 URL 中的 flag 参数
  const urlParams = new URLSearchParams(window.location.search);

  const flag = urlParams.get('flag');  // 获取 flag 参数的值
  const hotelId = urlParams.get('hotelId');



  // 如果 flag 参数不存在或为空，设置表单为只读
  if (flag === 'common' && hotelId) {
    // 获取所有可编辑的表单元素（酒店信息）
    // 禁用另一个表单
    let formElements2 = document.querySelectorAll('#hotel-info input, #hotel-info button');
    formElements2.forEach(element => {
      if (element.type === 'text' || element.type === 'datetime-local') {
        element.setAttribute('readonly', true);  // 设置为只读
      }
      if (element.type === 'file') {
        element.setAttribute('disabled', true);  // 禁用文件上传
      }
      if (element.type === 'button' || element.type === 'submit') {
        element.setAttribute('disabled', true);  // 禁用按钮
      }
    });

    let formElements = document.querySelectorAll('#hotel-franchise input, #hotel-franchise button');

    formElements.forEach(element => {
      if (element.type === 'text' || element.type === 'datetime-local') {
        element.removeAttribute('readonly');  // 确保文本框和日期框可以编辑
      }
      if (element.type === 'file') {
        element.removeAttribute('disabled');  // 确保文件上传可以操作
      }
      if (element.type === 'button' || element.type === 'submit') {
        element.removeAttribute('disabled');  // 确保按钮可以点击
      }
    });


  } else {
    // 禁用另一个表单
    let formElements2 = document.querySelectorAll('#hotel-franchise input, #hotel-franchise button');
    formElements2.forEach(element => {
      if (element.type === 'text' || element.type === 'datetime-local') {
        element.setAttribute('readonly', true);  // 设置为只读
      }
      if (element.type === 'file') {
        element.setAttribute('disabled', true);  // 禁用文件上传
      }
      if (element.type === 'button' || element.type === 'submit') {
        element.setAttribute('disabled', true);  // 禁用按钮
      }
    });
  }

});

//发起入驻请求
$('#hotel-info').on('submit', function (e) {
  e.preventDefault();
  // var formData = $(this).serialize();
  const provinceSelect = document.getElementById('province');
  const citySelect = document.getElementById('city');
  const districtSelect = document.getElementById('district');
  const hotelName = document.querySelector('[name="hotelName"]').value; //酒店名称
  const hotelAddress = document.querySelector('[name="hotelAddress"]').value; //酒店地址
  const provinceLocation = provinceSelect.options[provinceSelect.selectedIndex].textContent; //省份位置
  const cityLocation = citySelect.options[citySelect.selectedIndex].textContent; //城市位置
  const regionLocation = districtSelect.options[districtSelect.selectedIndex].textContent; //区域位置
  const hotelContext = document.querySelector('[name="hotelContext"]').value; //酒店联系人
  const hotelDesc = document.querySelector('[name="hotelDesc"]').value; //酒店介绍
  const hotelImg = document.getElementById('hotelImg').value; //酒店图片
  const hotelPhone = document.querySelector('[name="hotelPhone"]').value; //酒店联系方式

  // 校验字段
  if (!hotelName) {
    alert("酒店名称不能为空！");
    return;
  }


  if (!provinceLocation || !cityLocation || !regionLocation) {
    alert("请选择正确的省市区");
    return;
  }

  if (!hotelAddress) {
    alert("酒店地址不能为空！");
    return;

  }

  if (!hotelContext) {
    alert("酒店联系人不能为空！");
    return;

  }

  if (!hotelPhone || !/^\d{11}$/.test(hotelPhone)) {  // 假设电话号码为11位数字
    alert("请输入有效的酒店电话！");
    return;
  }

  if (!hotelDesc) {
    alert("酒店介绍不能为空！");
    return;
  }

  if (!hotelImg) {
    alert('请上传酒店图片');
    return
  }
  const userId = new URLSearchParams(window.location.search).get('userId');

  // 将表单数据汇总到一个对象中
  const formData = {
    hotelName,
    hotelAddress,
    hotelContext,
    hotelDesc,
    hotelImg,
    hotelPhone,
    hotelLocation: {
      provinceLocation,
      cityLocation,
      regionLocation,
      detailLocation: hotelAddress,
    }
  };
  if (userId) {
    formData.userId = userId;
  }

  $.ajax({
    url: 'http://localhost:8080/hotel/save',
    type: "post",
    contentType: 'application/json',  // 确保请求头是 application/json
    data: JSON.stringify(formData),
    success: function (rs) {
      if (rs.code === 2001) {
        alert('申请入驻成功，请等待审核处理结果！')
      } else {
        alert('申请失败，请重试或联系客服！')
      }
    },
    error: function (xhr, status, error) {
      console.error("Error:", status, error);
    }

  })
  // 打印表单数据到控制台，您可以在这里处理或发送到服务器
})

// 上传图片
$('#fileUploadImages').on('change', function (e) {
  e.preventDefault(); // 阻止默认的提交行为


  const files = e.target.files;
  const formData = new FormData();

  if (files.length < 5) {
    alert('请上传规定数量的酒店图片！');
    return;
  }

  // 将文件添加到 FormData 中
  for (let i = 0; i < files.length; i++) {
    formData.append('file', files[i]);
  }

  // 添加文件名称字段
  formData.append('files', 'hotels/images/index');

  //先不发送请求
  $.ajax({
    url: 'http://localhost:8080/file/upload',
    type: "post",
    data: formData,
    processData: false,   // 需要禁用 jQuery 的自动处理
    contentType: false,   // 让浏览器自动设置 Content-Type 头
    success: function (rs) {
      if (rs.code === 2001) {
        const hrefs = rs.t
        let hrefString = '';  // 使用 let 而不是 const
        if (hrefs.length > 0) {
          hrefString = hrefs.join('-');  // 重新赋值
        } else {
          hrefString = hrefs[0];  // 重新赋值
        }
        // 将拼接后的字符串设置到隐藏的 input 元素中
        document.getElementById('hotelImg').value = hrefString;
        const previewContainer = document.getElementById('imagePreview');
        previewContainer.innerHTML = ''; // 清空现有的预览
        hrefs.forEach(href => {
          const img = document.createElement('img');
          img.src = href;
          img.style.maxWidth = '100px'; // 可调整图片的显示大小
          img.style.marginRight = '10px'; // 可调整图片之间的间隔
          previewContainer.appendChild(img);
        })
      }
    },
    error: function (xhr, status, error) {
      console.error("Error:", status, error);
    }

  })

})
// 加盟合约下载
document.getElementById('hotel-league').addEventListener('click', function () {
  const fileUrl = 'https://haveno.oss-cn-beijing.aliyuncs.com/hotels/league/%E9%81%BF%E9%A3%8E%E6%B8%AF%E9%85%92%E5%BA%97%E5%8A%A0%E7%9B%9F%E5%8D%8F%E8%AE%AE.docx';  // 这里是你要下载的文件的 URL

  // 创建一个隐藏的 < a > 标签元素来触发下载
  const a = document.createElement('a');
  a.href = fileUrl;  // 文件的 URL
  a.download = '加盟合约.pdf';  // 设定下载文件的名称
  a.style.display = 'none';  // 隐藏链接

  // 将 < a > 标签添加到文档中
  document.body.appendChild(a);

  // 触发点击事件，启动下载
  a.click();

  // 下载完成后移除这个临时的 <a> 标签
  document.body.removeChild(a);
});

//上传文档
$('#fileUploadDocs').on('change', function (e) {
  e.preventDefault(); // 阻止默认的提交行为
  const files = e.target.files;
  const formData = new FormData();

  // // 将文件添加到 FormData 中
  for (let i = 0; i < files.length; i++) {
    formData.append('file', files[i]);
  }

  // // 添加文件名称字段
  formData.append('files', 'hotels/documents');

  // const docs = ['https://haveno.oss-cn-beijing.aliyuncs.com/hotels/documents/1731683809554.docx', 'https://haveno.oss-cn-beijing.aliyuncs.com/hotels/documents/1731684023435.docx'];
  // if (docs.length > 0) {
  //   hrefString = docs.join(';');  // 重新赋值
  // } else {
  //   hrefString = hrefs[0];  // 重新赋值
  // }
  // // 将拼接后的字符串设置到隐藏的 input 元素中
  // document.getElementById('contract').value = hrefString;
  // 先不发送请求
  $.ajax({
    url: 'http://localhost:8080/file/upload',
    type: "post",
    data: formData,
    processData: false,   // 需要禁用 jQuery 的自动处理
    contentType: false,   // 让浏览器自动设置 Content-Type 头
    success: function (rs) {
      if (rs.code === 2001) {
        const docs = rs.t
        if (docs.length > 0) {
          hrefString = docs.join(';');  // 重新赋值
        } else {
          hrefString = hrefs[0];  // 重新赋值
        }
        // 将拼接后的字符串设置到隐藏的 input 元素中
        document.getElementById('contract').value = hrefString;
        const previewContainer = document.getElementById('docPreview');

        previewContainer.innerHTML = ''; // 清空现有的预览
        const maxLength = 15;  // 设置文件名最大显示长度
        for (let i = 0; i < docs.length; i++) {
          const file = docs[i];
          const fileName = document.createElement('span');
          // 如果文件名超过最大长度，进行截断
          if (file.length > maxLength) {
            const truncatedFile = file.slice(0, 10) + '...' + file.slice(-5);  // 保留前10个字符和后5个字符，中间部分用省略号
            fileName.textContent = truncatedFile;
          } else {
            fileName.textContent = file;  // 如果文件名不长，直接显示
          }

          previewContainer.appendChild(fileName);  // 将文件名添加到预览容器中
          previewContainer.appendChild(document.createTextNode('    '));  // 添加一个空格，不换行
          // fileName.textContent = file;
          // previewContainer.appendChild(fileName);

        }
      }
    },
    error: function (xhr, status, error) {
      console.error("Error:", status, error);
    }

  })



})



// 设置日期时间限制为当天之后的时间
document.addEventListener('DOMContentLoaded', function () {
  const deadlineInput = document.getElementById('expiresTime');

  // 获取当前日期
  const currentDate = new Date();
  const year = currentDate.getFullYear();
  const month = String(currentDate.getMonth() + 1).padStart(2, '0'); // 月份从0开始，所以加1
  const day = String(currentDate.getDate()).padStart(2, '0'); // 确保日期是两位数
  const hours = String(currentDate.getHours()).padStart(2, '0'); // 确保小时是两位数
  const minutes = String(currentDate.getMinutes()).padStart(2, '0'); // 确保分钟是两位数

  // 拼接当前日期时间
  const currentDateTime = `${year}-${month}-${day}T${hours}:${minutes}`;

  // 设置input的最小时间为当前时间
  deadlineInput.setAttribute('min', currentDateTime);
});


//点击导航条变色
$(function () {
  $('.nav-item').click(function () {
    $(this).children().addClass('active');
    $(this).siblings('li').children().removeClass('active')
  })
})



//添加登录
window.onload = function () {
  var nickname = sessionStorage.getItem("nickname");

  if (nickname) {
    // 如果有昵称，替换登录注册的链接
    document.querySelector('.user-account').innerHTML = `
            <span>Hello! ${nickname}</span>/
            <a href="#" id="logout">退出登录</a>
        `;

    // 添加点击事件来处理退出登录
    document.getElementById('logout').addEventListener('click', function (event) {
      event.preventDefault();  // 阻止默认的链接跳转
      sessionStorage.removeItem("nickname");  // 清除昵称
      alert('谢谢使用');
      window.location.href = "login.html";  // 跳转到登录页面
    });
  }

};


// 绑定自定义按钮与隐藏的文件输入框
document.getElementById("customUploadBtn").addEventListener("click", function () {
  document.getElementById("fileUploadImages").click(); // 触发文件选择
});

document.getElementById("customUploadDocsBtn").addEventListener("click", function () {
  document.getElementById("fileUploadDocs").click(); // 触发文件选择
});




// 省市区数据库渲染
// 页面加载时加载省份
window.onload = function () {
  loadProvinces();
};

// 加载省份
function loadProvinces() {
  $.ajax({
    url: "http://localhost:8080/location/area",
    type: "get",
    data: { 'id': 0 },
    success: function (rs) {
      if (rs.code === 2001) {
        const data = Object.values(rs.t); // 将对象转换为数组
        const provinceSelect = document.getElementById('province');


        // 遍历转换后的数组
        data.forEach(province => {

          const option = document.createElement('option');
          option.value = province.area_id; // 使用 province.id 作为 option 的 value
          option.textContent = province.name; // 使用 province.province_name 作为 option 的显示文本
          provinceSelect.appendChild(option); // 将 option 添加到 select 中
        });
      }
    },
    error: function (xhr, status, error) {
      console.error("Error:", status, error);
    }
  })
}

// 省份选择改变事件，加载城市
document.getElementById('province').addEventListener('change', function () {
  const provinceId = this.value;
  clearSelect('city');
  clearSelect('district');
  if (provinceId) {
    loadCities(provinceId);
  }
});

// 加载城市
function loadCities(provinceId) {
  $.ajax({
    url: "http://localhost:8080/location/area",
    type: "get",
    data: {
      'id': provinceId
    },
    success: function (rs) {
      if (rs.code === 2001) {

        const data = Object.values(rs.t); // 将对象转换为数组
        const citySelect = document.getElementById('city');

        // 遍历转换后的数组
        data.forEach(city => {
          const option = document.createElement('option');
          option.value = city.area_id;
          option.textContent = city.name;
          citySelect.appendChild(option);
        });
      }
    },
    error: function (xhr, status, error) {
      console.error("Error:", status, error);
    }
  })
}

// 城市选择改变事件，加载区县
document.getElementById('city').addEventListener('change', function () {
  const cityId = this.value;
  clearSelect('district');
  if (cityId) {
    loadDistricts(cityId);
  }
});

// 加载区县
function loadDistricts(cityId) {
  $.ajax({
    url: "http://localhost:8080/location/area",
    type: "get",
    data: {
      'id': cityId
    },
    success: function (rs) {
      if (rs.code === 2001) {
        const data = Object.values(rs.t); // 将对象转换为数组
        const districtSelect = document.getElementById('district');
        // 遍历转换后的数组
        data.forEach(district => {
          const option = document.createElement('option');
          option.value = district.area_id;
          option.textContent = district.name;
          districtSelect.appendChild(option);
        });
      }
    },
    error: function (xhr, status, error) {
      console.error("Error:", status, error);
    }
  })
}

// 清空选择框
function clearSelect(id) {
  const select = document.getElementById(id);
  select.innerHTML = '<option value="">请选择</option>';
}


//监听
// 获取省、市、区下拉框和详细地址输入框
const provinceSelect = document.getElementById('province');
const citySelect = document.getElementById('city');
const districtSelect = document.getElementById('district');
const addressInput = document.getElementById('address');
const hotelInput = document.querySelector('[name="hotelName"]');
// 定义更新详细地址的函数
function updateAddress() {
  // 获取选中的省、市、区的具体选项内容
  const provinceOption = provinceSelect.options[provinceSelect.selectedIndex];
  const cityOption = citySelect.options[citySelect.selectedIndex];
  const districtOption = districtSelect.options[districtSelect.selectedIndex];
  const hotelName = document.querySelector('[name="hotelName"]').value; //酒店名称
  // 获取选项的文本内容
  const province = provinceOption && provinceOption.text !== '选择省' && provinceOption.text !== '请选择' ? provinceOption.text : '';
  const city = cityOption && cityOption.text !== '选择市' && cityOption.text !== '请选择' ? cityOption.text : '';
  const district = districtOption && districtOption.text !== '选择区/县' && districtOption.text !== '请选择' ? districtOption.text : '';

  // 将获取到的选项内容更新到地址框中
  addressInput.value = province + city + district + hotelName;
}

// 为省、市、区下拉框添加change事件监听
provinceSelect.addEventListener('change', updateAddress);
citySelect.addEventListener('change', updateAddress);
districtSelect.addEventListener('change', updateAddress);
hotelInput.addEventListener('input', updateAddress);





$('#hotel-franchise').on('submit', function (e) {
  e.preventDefault();

  // 获取酒店法人姓名
  const legalName = document.querySelector('[name="legalName"]').value;

  // 获取酒店法人电话号码
  const hotelLegalContext = document.querySelector('[name="hotelLegalContext"]').value;


  // 获取预签合同到期时间
  const expiresTime = document.getElementById("expiresTime").value;

  // 获取加盟合约的隐藏字段
  const contract = document.getElementById("contract").value;

  // 校验酒店法人姓名 (不能为空)
  if (!legalName) {
    alert('酒店法人姓名不能为空');
    return
  }

  // 校验酒店法人电话 (手机号的简单格式检查)
  const phoneRegex = /^[1][3-9][0-9]{9}$/;
  if (!phoneRegex.test(hotelLegalContext) || !phoneRegex) {
    alert('酒店法人电话格式不正确');
    return
  }

  if (!contract) {
    alert('请上传酒店资质文件');
    return
  }

  // 校验预签合同到期时间 (不能为空，且不能早于当前日期)
  if (!expiresTime) {
    alert('预签合同到期时间不能为空');
    return
  }
  const userId = new URLSearchParams(window.location.search).get('userId');
  const hotelId = new URLSearchParams(window.location.search).get('hotelId');
  const formData = {
    contract,
    hotelLegalContext,
    legalName,
    expiresTime,
    hotelId
  }

  if (userId) {
    formData.operateId = userId;
  }

  $.ajax({
    url: 'http://localhost:8080/hotel/saveHotelFranchise',
    type: "post",
    contentType: 'application/json',  // 确保请求头是 application/json
    data: JSON.stringify(formData),
    success: function (rs) {
      if (rs.code === 2001) {
        alert('申请加盟成功，请等待审核处理结果！')
      } else {
        alert('申请失败，请重试或联系客服！')
      }
    },
    error: function (xhr, status, error) {
      console.error("Error:", status, error);
    }

  })

})